<!DOCTYPE html>
<html xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <script src="https://unpkg.com/vue"></script>
    <title></title>
</head>

<body>
<!--这是我们的View-->
<div id="helloworld">
    {{ message }}
</div>
<div id="studyBind">
    <span v-bind:title="vbindMesage">
        学习v-bind
    </span>
</div>
<div id="booleanStudy" v-if="boolData" >
    vue的布尔学习
</div>

<div id="studyFor">
    <ol>
        <li v-for="user in users">
            {{user.name}}
        </li>
    </ol>
</div>

</body>
<script src="js/vue.js"></script>
<script>

    var userFor=new Vue({
        el:'#studyFor',
        data:{
            users:[
                {name:'caomin'},
                {name:"萌萌"}
            ]
        }
    })


      new Vue({
        el:'#booleanStudy',
        data:{
            boolData:false
        }
    })
    var testBool={
        show:true
    }



   var app2= new Vue({
        el:'#studyBind',
        data:{
            vbindMesage:'页面加载于'+new Date().toDateString()
        }
    })

    // 这是我们的Model
    var exampleData = {
        message: 'Hello vue.js!'
    }

    // 创建一个 Vue 实例或 "ViewModel"
    // 它连接 View 与 Model
    new Vue({
        el: '#helloworld',
        data: exampleData,
        method:{

        }
    })
</script>
</html>